/*首页思路分析 

1.a标签点击高亮
2.网页嵌套功能（a标签+iframe标签）
3.初始化数据
4.退出功能
5.搜索功能(做完整个项目,最后大家课后自行实现：根据学号搜索学员)
*/
document.querySelectorAll('.nav>li>ul>li>a').forEach(item => {
    item.addEventListener('click', function () {
      document.querySelector('.active').classList.remove('active')
      this.classList.add('active')
      this.target = 'myframe'
    })
  })
  document.querySelector('.init').addEventListener('click',function(){
    axios({
      url:'/init/data',
      method:'get',
    }).then(res=>{
      //成功回调
      console.log(res)
      if(res.data.code === 1){
        Toast.fail(res.data.message)
      }
    })
  })

  //退出登录 销毁token
  document.querySelector('.logout').addEventListener('click',function(){
    if(confirm('您确定要退出吗?')){
      localStorage.removeItem('token')
      location.href = './login.html'
    }
  })

  //查询学生信息模块
document.querySelector('.search button').addEventListener('click',function(){
  const id = document.querySelector('[type="text"]').value
  if(!id)return Toast.fail('搜索框不能为空')
  if(!(/^\d{4,}$/.test(id))){
    return Toast.fail('至少四位纯数字')
  }
  axios({
    url:'/student/one',
    method:'get',
    params: { id }
  }).then(res=>{
    //成功回调
    console.log(res)
  document.querySelectorAll('.nav>li>ul>li>a')[1].click()
    if(res.data.message === '获取成功'){
      Toast.success(res.data.message)
      const arr = Object.values(res.data.data)
      console.log(arr)
      document.querySelector('tbody').innerHTML = arr.map(item => `
          <tr>
          <th scope="row">${item[0]}</th>
          <td>${item[1]}</td>
          <td>${item[3]}</td>
          <td>${item.sex}</td>
          <td>${item.group}</td>
          <td>${item.phone}</td>
          <td>${item.salary}</td>
          <td>${item.truesalary}</td>
          <td>${item.province + item.city + item.county}</td>
          <td>
            <button data-id="${item.id}" type="button" class="btn btn-primary btn-sm">修改</button>
            <button data-id="${item.id}" type="button" class="btn btn-danger btn-sm">删除</button>
          </td>
        </tr>`).join('')
    }else{
      Toast.fail(res.data.message)
    }
  })
})

